package myJs.myPkg.RSelect

import org.scalajs.dom
import org.scalajs.dom.{Event, html}
import slinky.core._
import slinky.core.annotations.react
import slinky.core.facade.ReactRef

import scala.scalajs.js
import scala.scalajs.js.annotation.JSImport

/**
 * Created by yz on 7/2/2022
 */

case class SelectOption(value: String, label: String)

object SelectOption {


}

@js.native
trait SelectOptionT extends js.Object {

  val value: js.UndefOr[String] = js.native
  val label: js.UndefOr[String] = js.native

}

@react object Select extends ExternalComponent {

  case class Props(
                    defaultValue: js.UndefOr[SelectOption] = js.undefined,
                    onChange: js.UndefOr[js.Function1[SyntheticEvent[TagElement#RefType, Event], Unit]] = js.undefined,
                    options: List[SelectOption],
                    placeholder: js.UndefOr[String] = js.undefined,
                    name: js.UndefOr[String] = js.undefined,
                    value: js.UndefOr[SelectOption] = js.undefined,
                    ref: js.UndefOr[ReactRef[html.Select]] = js.undefined,
                    isClearable: js.UndefOr[Boolean] = js.undefined,
                  )

  @js.native
  @JSImport("react-select", JSImport.Default)
  object Component extends js.Object {

  }

  override val component = Component

}
